{{useCss "app-pages/css/main.scss",(["/main.html","/"]) }}
<div class="imgbox" id="box">
    <mobile_picwall array-data-key="bus_info.config.home_imgs"></mobile_picwall>
</div>

<!-- goods -->
<div class="_main_goods_list">
   
    <div class="_main_goods">
        {{#each $Cache.main.goods_list}}
            <div class="new_goods">
                <div class="newgoods">
                    <div class="img">
                        <href to="goods_details.html?id={{_id}}">
                            <img bind-src="{{preview_img_url}}?imageView/1/h/330/w/330" />
                        </href>
                    </div>
                    <div class="info">
                        <div class="name">
                            {{goods_name}}
                        </div>
                        <div class="intro">{{intro}}</div>
                    </div>
                </div>
                <img class="icon" src="/app-pages/images/new_flag.png"/>
            </div>
        {{/each}}
    </div>


    {{#if !$Cache.main.loading_tags_completed}}
    <div class="icon-spin4 animate-spin">正在加载</div>
    {{#else}}
    <!-- tag goods -->
    {{#each $Cache.main.classify_list}}
        {{#if contents.length}}
        <div class="_main_title">
            {{title}}
            <href to="/classify_goods_list.html?id={{_id}}" class="tag_more">更多</href>
        </div>
        <div class="_main_goods">
            {{#each contents}}
                {{#> "jewel-mobile-main-goods","$This",6 > $Index}}
            {{/each}}
        </div>
        {{/if}}
    {{/each}}
    {{/if}}
</div>
<div class="_main_bottom">
    <href to="goods_list.html?id=3">点此查看更多商品</href>
</div>

<xmp type="tag" name="mobile_picwall">
    <div class="picwall">
        <div class="carosule">
            <div class="pic-show">
            {{#if ${array-data-key}.length }}
                {{#each ${array-data-key} }}
                <div style="z-index:{{$Parent.length-$Index}}" class="pic">
                    <href target="_blank" bind-to="{{href||'javascript:void 0'}}">
                        <img bind-src="{{img_url}}?imageView/1/w/500/h/350/q/95" data="{{$Index}}" />
                    </href>
                </div>
                {{/each}}
            {{#else}}
                <div style="z-index:{{$Parent.length-$Index}}" class="pic">
                    <href target="_blank" bind-to="{{href||'javascript:void 0'}}">
                        <img bind-src="/images/default_bg.jpg" />
                    </href>
                </div>
            {{/if}}
            </div>
        </div>
        {{#if ${array-data-key}.length>1}}
        <div class="point_box">
            {{#each ${array-data-key} }}
            <div class="point {{($Index==$Top.$Cache.main.picwall.count)&&'focus'}}"></div>
            {{/each}}
        </div>
        {{/if}}
    </div>
    <script type="text/vm">
        function(vm) {
            var picwall = vm.queryElement({
                className: 'picwall'
            })[0];
            var img = vm.queryElement({
                tagName: "IMG"
            });
            var movebox = vm.queryElement({
                className: "carosule"
            })[0];
            require(["jQuery", "touch"], function($, touch) {
                var $picwall = $(picwall);
                var $movebox = $(movebox);
                var w = $picwall.width();
                var h = w * 0.4;
                $picwall.height(h);
                var pics = $picwall.find(".pic");
                var len = $(pics).length;
                var _i = 0;
                var _count;
                if (len > 1) {
                    var timer = setInterval(function _() {
                        _count = _i % len;
                        $movebox.stop().animate({
                            marginLeft: -w * _count
                        });
                        App.set("$Cache.main.picwall.count", _count);
                        _i += 1;
                        return _;
                    }(), 5000);
                    touch.on(img, "swipeleft", function() {
                        _i = parseInt($(this).attr("data")) + 1;
                        if (_i < len) {
                            $movebox.stop().animate({
                                marginLeft: -w * _i
                            });
                            App.set("$Cache.main.picwall.count", _i);
                        };
                    });
                    touch.on(img, "swiperight", function() {
                        if (parseInt($(this).attr("data")) > 0) {
                            _i = parseInt($(this).attr("data")) - 1;
                            $movebox.stop().animate({
                                marginLeft: -w * _i
                            });
                            App.set("$Cache.main.picwall.count", _i);
                        };
                    });
                };
            });
        };
    </script>
</xmp>

<xmp type="template" name="jewel-mobile-main-goods">
    <div class="maingoods">
        <div class="img">
            <href to="goods_details.html?id={{_id}}">
                <img bind-src="{{preview_img_url}}?imageView/1/h/330/w/330" />
            </href>
        </div>
        <div class="info">
            <div class="intro">
                {{goods_name}}　{{intro}}
            </div>
            <div class="price">￥{{card_cash_map[$Top.loginer.current_card_factory_id]||cash}}</div>
            <del>{{original_price?"￥"+original_price:""}}</del>
        </div>
    </div>
</xmp>
